
#@layoutT('录制分组')
#define main()
<div class="container-wrap">
   <ul class="layui-tab-title" id="group_category"></ul>
   #@table()
   <script type="text/html" id="bar">
      <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
      #if(vs.funcMap.get('group_distribute'))
      <a class="layui-btn layui-btn-xs" lay-event="distribute">分配</a>
      #end
      <a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del">删除</a>
   </script>
</div>
#end

#define js()
<!-- 分页表格 -->
<script>
   getGroupCategory();

   var myCode="#(vs.code)";
   function distributeRecord(obj){
      var data=obj.data;
      var id=data.id;
      var name=data.name;
      if (data.id != data.parent_group_id) {
         layer.msg("该分组不属于自己分组,不能进行分配");
         return;
      }
      var url='#(path)/record/group/distributeRecord?id='+id+"&name="+name;
      openDialog("配置录制场景",url,false,null,null);
   }

   gridArgs.title='录制分组';
   gridArgs.dataId='id';
   gridArgs.deleteUrl='#(path)/record/group/delete';
   gridArgs.updateUrl='#(path)/record/group/edit/';
   gridArgs.addUrl='#(path)/record/group/add';
   gridArgs.gridDivId ='maingrid';
   initGrid({id : 'maingrid'
      ,elem : '#maingrid'
      ,toolbar:'#table_toolbar'//开启头部工具栏，并为其绑定左侧模板
      /*
      ,defaultToolbar:['filter', 'exports', 'print',{//自定义头部工具栏右侧图标。如无需自定义，去除该参数即可
          title:'提示',layEvent: 'LAYTABLE_TIPS',icon: 'layui-icon-tips'
      }]
      */
      ,cellMinWidth: 100
      ,cols : [ [
         {title: '主键',field : 'id',width : 35,checkbox : true},
         {title:'序号',type:'numbers',width:35},
         {title:'录制分组名称',field:'name'},
         {title:'创建时间',field:'create_time'},
         {title:'修改时间',field:'update_time'},
         {title:'操作', fixed:'right',width : 180,align : 'left',toolbar : '#bar'}
      ] ]
      ,url:"#(path)/record/group/list"
      ,searchForm : 'searchForm'
   },{distribute:distributeRecord});

   function registerGroupCategory() {
      $("ul#group_category").on("click",'li', function(){      //只需要找到你点击的是哪个ul里面的就行
         $("ul#group_category li").css({'background-color' : ""});
         let categoryName = $(this).text();
         if (categoryName) {
            $(this).css({'background-color' : "rgb(64, 158, 255)"});
            //上述方法等价于
            table.reload('maingrid', {

               where: { //设定异步数据接口的额外参数，任意设
                  categoryName: categoryName
               }
               ,page: true
            }); //只重载数据

         }
      });
   }

   function getGroupCategory() {
      var url = "#(path)/record/group/getGroupCategory";
      $("#group_category").empty();
      $.ajax({
         url: url,
         type: "GET",
         success: function (result) {
            for (let i = 0; i < result.length; i++) {
               $('#group_category').append('<li>' + result[i] +'</li>');
            }
         }
      });

      registerGroupCategory();
   }
</script>
#end



